// 引入 ViewChild 操作dom
import { Component, OnInit, ViewChild } from '@angular/core';
import { en_US, NzI18nService } from 'ng-zorro-antd/i18n';
import { NzFormatEmitEvent } from 'ng-zorro-antd/core';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css'],
  // 貌似是优先加载 template里面的，
  // 如果这里不写就显示 home.component.html 里面的
  // template: `
  // <button nz-button nzType="primary">Primary22</button>
  // <button nz-button nzType="default">Default</button>
  // <button nz-button nzType="dashed">Dashed</button>
  // <button nz-button nzType="danger">Danger</button>
  // <button nz-button nzType="link">Link</button>
  // `,
  // styles: [
  //   `
  //     [nz-button] {
  //       margin-right: 8px;
  //       margin-bottom: 12px;
  //     }
  //   `
  // ]
})
export class HomeComponent implements OnInit {

  menu = [{
    title: '1',
    _open:true, //默认打开第一级
    items: [{
      title: '1.1',
      items: [
        {
          name: '1.1.1',
          title: 'xxx',
          items: []
        }
      ]
    }, {
      title: '1.2',
      items:[]
    }
    ]
  }]

  // 登录成功的提示框
  @ViewChild('nzTreeComponent', { static: true }) nzTreeComponent: any;

  constructor(
    private i18n: NzI18nService
  ) { }

  ngOnInit() {

  }
  ngAfterViewInit() {
    var a = this.getValue()
    console.log(a)
  }

  // 选择语言？这个怎么用啊，看不懂
  // 用于动态修改国际化文案。
  switchLanguage() {
    this.i18n.setLocale(en_US);
  }

  // 默认选中的复选框的树节点
  defaultCheckedKeys = ['1', '2'];
  // 指定选中的树节点   这个指的是 除了那个复选框外，文本默认被选中的节点
  defaultSelectedKeys = ['0'];
  // 默认展开的父节点  
  defaultExpandedKeys = ['0', '1', '2'];

  nodes2 = [
    {
      title: '所有权限',
      key: '0',
      expanded: true,

      children: [
        {
          title: '今日任务',
          key: '1',
          isLeaf: true
        },
        {
          title: '系统状态',
          key: '2',
          children: [   // 不写这个 isLeaf 是否是叶子节点，那么前面就会有下拉的按钮，true 代表是叶子节点
            { title: '终端状态', key: '2-1', isLeaf: true },
            { title: '任务状态', key: '2-1', isLeaf: true }
          ]
        },
        {
          title: '任务管理',
          key: '3',
          children: [
            { title: '常规任务', key: '3-1', isLeaf: true },
            { title: '插播任务', key: '3-2', isLeaf: true }
          ]
        }
      ]
    }

  ];

  nzEvent(event: NzFormatEmitEvent): void {
    //console.log(event);
  }

  getValue() {
    // console.log("点击了获取值")

    // 直接遍历 原数组
    // console.log(this.nodes2)
    var a: any = this.nodes2
    // 1、先将原数组拿出来,这里的数组里的数据其实只有一个
    var node3: any
    for (var i = 0; i < a.length; i++) {
      // console.log(a[i])
      node3 = a[i]
    }
    // 2、如果总的选择（最顶上哪一级 所有） 是 true ,那就给 全部写成 true
    // console.log(node3.checked)
    if (node3.checked == true) {
      console.log("选择了全部权限")
      // 这里写，选择了全部权限的方法

    }

    // 3、新建一个 空数组 存储所有选中的 内容
    var checked: any[] = []
    // console.log(node3.children) // 就是在这里面循环
    var c = node3.children

    // 4、如果 是叶子节点 并且 选中了  将值放到 checked 中
    for (var i = 0; i < c.length; i++) {
      // console.log(c[i])
      if (c[i].isLeaf == true && c[i].checked == true) {
        //console.log(c[i].title)
        checked.push(c[i].title)
      }

      
      // 5、如果 不是叶子节点 需要再次遍历 它的 children 
      if (c[i].isLeaf != true) {
        //console.log("我不是叶子节点")
        var d = c[i].children
        for (var j = 0; j < d.length; j++) {
          //console.log(d[j].title)
          // 6、如果 选中了 并且是 叶子节点 放到 checked 中，我这里一般也就两重循环就够了,
          if (d[j].isLeaf == true && d[j].checked == true) {
           // console.log(d[j].title)
            checked.push(d[j].title)
          }
        }
      }
    }

    // 输出最后选中的
    console.log("最后选中的内容有：")
    console.log(checked)
    return checked
  }
}
